<template>
  <view class="organization-container">
    <!-- Logo区域 -->
    <view class="logo-section">
      <image class="logo" src="/static/home/logo.jpg" mode="aspectFit"></image>
      <text class="platform-name">GVR数字化加油维修解决方案平台</text>
    </view>

    <!-- 选择提示 -->
    <view class="select-hint">
      请选择加入组织
    </view>

	<view class="type-selection">
	  <type-select-item
		text="加入已有组织"
		:isActive="selectedType === 'join'"
		@click="handleSelect('join')"
	  />
	  
	  <type-select-item
		text="创建新组织 (我是站长/管理员)"
		:isActive="selectedType == 'create'"
		@click="handleSelect('create')"
	  />
	</view>
    <!-- 底部按钮 -->
    <view class="button-section">
      <button class="gvr-yellow-button surebutton"  @click="sureClick">确认选择</button>
    </view>
  </view>
</template>

<script setup>
import { ref,onMounted} from 'vue'
import { onShow } from '@dcloudio/uni-app'
import { userStore } from '@/utils/userStore.js'
import { RouterMethods } from '../../utils/router'
import { USER_TYPES } from '@/service/api'
// 用户信息
const userInfo = ref({
	type:''
})
onMounted(() => {
  console.log('选择组织 onMounted')
  initUserInfo()
})

// 页面显示时检查状态
onShow(() => {
  console.log("选择组织 onShow")
  initUserInfo()
})
// 初始化用户信息
const initUserInfo = () => {
  const storedInfo = userStore.getUserInfo()
  if (storedInfo) {
    userInfo.value = storedInfo
  }
}
	
const selectedType = ref('')

const handleSelect = (type) => {
   selectedType.value = type
}	
const sureClick = () => {
	if (selectedType.value == '') {
		uni.showToast({
			title:'请选择加入组织',
			icon:'none'
		})
		return
	} 
	if (selectedType.value == 'join') {
	   RouterMethods.toInputID()
	} else {
	   if (userInfo.value.type == USER_TYPES.GAS) {
		 RouterMethods.toGasCreateOrg()
	   } else if(userInfo.value.type == USER_TYPES.MAINTENANCE) {
		RouterMethods.toRepairerCreateOrg()
	   }
	}
}

</script>

<style scoped>
.organization-container {
  min-height: 100vh;
  background-color: #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 58rpx;
  box-sizing: border-box;
}

.logo-section {
  margin-top: 162rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.logo {
  width: 476rpx;
  height: 108rpx;
  object-fit: contain;
}

.platform-name {
  margin-top: 26rpx;
  font-family: PingFangSC-Medium;
  font-size: 32rpx;
  color: #000000;
  letter-spacing: 0;
  font-weight: 500;
}

.select-hint {
  margin-top: 40rpx;
  font-family: PingFangSC-Medium;
  font-size: 32rpx;
  color: #000000;
  letter-spacing: 0;
  text-align: center;
  font-weight: 500;
}

.type-selection {
  /* background-color: red; */
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20rpx;
  padding-top: 40rpx;
  padding-bottom: 40rpx; /* 添加底部间距 */
}
/* 底部按钮区域样式修改 */
.button-section {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  padding-bottom: env(safe-area-inset-bottom);
  background-color: #FFFFFF;
}

.surebutton {
  border-radius: 0;
}
</style>